<template>
  <div>
    <div>国际化vue-i18n</div>

    <div>普通用法:{{ $t('THEME_OTHER.theme') }}</div>

    <div>
      $用法:
      {{ $t('THEME_HOME.name', { name: '张三', age: 18 }) }}
    </div>

    <div>
      v-t用法:
      <span v-t="{ path: 'THEME_HOME.name', args: { name: '李四', age: 16 } }"></span>
    </div>

    <hr />
    <button @click="setLang('zh')">中文</button>
    <button @click="setLang('en')">英文</button>
  </div>
</template>
<script setup lang="ts">
import { useI18n } from 'vue-i18n';
const { locale } = useI18n()

// 设置语言
const setLang = (language: string) => {
  locale.value = language
}
</script>
<style lang="scss" scoped>
</style>
